<%--
  Created by IntelliJ IDEA.
  User: swg
  Date: 2017/10/9
  Time: 18:29
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta name="keywords" content="snailHome,蜗牛之家,蜗牛生活,oursnail" />
    <title>蜗牛之家</title>
    <style>
        *{margin:0;padding:0;outline:none;font-family:\5FAE\8F6F\96C5\9ED1,宋体;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-khtml-user-select:none;user-select:none;cursor:default;font-weight:lighter;}
        .whole{width:100%;height:100%;line-height:100%;position:fixed;bottom:0;left:0;z-index:-1000;overflow:hidden;}
        .whole img{width:100%;height:100%;}
        .mask{width:100%;height:100%;position:absolute;top:0;left:0;background:#000;opacity:0.6;filter:alpha(opacity=60);}
        .b{width:100%;text-align:center;height:400px;position:absolute;top:50%;margin-top:-230px}.a{width:150px;height:50px;margin-top:30px}.a a{display:block;float:left;width:150px;height:50px;background:#fff;text-align:center;line-height:50px;font-size:18px;border-radius:25px;color:#333}.a a:hover{color:#000;box-shadow:#fff 0 0 20px}
        p{color:#fff;margin-top:40px;font-size:24px;}

        button {
            margin: 30px 20px;
            padding: 15px 20px;
            border-radius: 10px;
            border: 2px solid;
            font: 16px 'Open Sans', sans-serif;
            text-transform: uppercase;
            background: none;
            outline: none;
            cursor: pointer;
            -webkit-transition: all .5s;
            transition: all .5s;
            font-family:微软雅黑;
        }

        /* btn-1 */
        .btn-1 {
            color: #A3F7BF;
            border-color: #A3F7BF;
            background: -webkit-linear-gradient(left, #a3f7bf, #a3f7bf) no-repeat;
            background: linear-gradient(to right, #a3f7bf, #a3f7bf) no-repeat;
            background-size: 0% 100%;
        }
        .btn-1:hover {
            background-size: 100% 100%;
            color: #27323A;
        }

        /* btn-2 */
        .btn-2 {
            color: #E4F68F;
            border-color: #E4F68F;
            background: -webkit-linear-gradient(left, #e4f68f, #e4f68f) no-repeat;
            background: linear-gradient(to right, #e4f68f, #e4f68f) no-repeat;
            background-size: 100% 0%;
        }
        .btn-2:hover {
            background-size: 100% 100%;
            color: #27323A;
        }
    </style>
</head>

<body>
<div class="whole">
    <img src="http://wx2.sinaimg.cn/large/d83cce73gy1fijg9xldptj21hc0zkwmv.jpg" />
    <div class="mask"></div>
</div>
<div class="b">
    <span style="color: #fff;font-size: 50px;"><h1>we are creative!</h1></span>
    <br/>
    <br/>
    <a href="${pageContext.request.contextPath}/front/index"><button class="btn-1">蜗牛之家</button></a>
    <a href="${pageContext.request.contextPath}/front/about"><button class="btn-2">关于我们</button></a>

</div>

</body>
